<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="java.util.*"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ include file="/WEB-INF/jsp/common/taglib.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>employeeInfo_Add</title>
<script src="<c:url value="/ui/jquery-1.10.2.js" />"></script>
<script src="<c:url value="/ui/jquery-migrate-1.2.1.js" />"></script>

<link rel="stylesheet" href="<c:url value="/demo/jquery.ui.all.css"/>">
<link href="<s:url value="/css/standard.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/pop_up.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/maintenance.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/Simplemodal.css" />" rel="stylesheet"
	type="text/css" />

<script src='<c:url value="/js/jquery.DynamicMessage.js" />'></script>
<script src='<c:url value="/js/jquery.simplemodal-1.4.1.js" />'></script>

<script src='<c:url value="/js/common.js" />'></script>
<script src='<c:url value="/js/common_ui.js" />'></script>
<script src='<c:url value="/js/poplayer.js" />'></script>
<script src='<c:url value="/js/maint_ui.js" />'></script>
<script src='<c:url value="/js/jquery.form.js" />'></script>

<script src="<c:url value="/ui/jquery.ui.core.js" />"></script>
<script src="<c:url value="/ui/jquery.ui.widget.js" />"></script>
<script src="<c:url value="/ui/jquery.ui.datepicker.js" />"></script>
<!--  <script src="<c:url value="/ui/jquery-ui-timepicker-addon.js" />"></script>-->

<script src="<c:url value="/ui/jquery-ui-slide.min.js" />"></script>
<link rel="stylesheet" href="<c:url value="/demo/demos.css" />">
<link rel="stylesheet" href="<c:url value="/demo/dateTime.css" />">

<script type="text/javascript">
$(function() {

	$('.example').datepicker({
		changeMonth : true,
		changeYear : true
	});

})
</script>
</head>
<body>

	<hr>
	<form:form method="post" name="addForm">
		<table width="100%" border="0" cellspacing="0" cellpadding="0"
			class="problemDes">
			<tr>
				<td colspan="2" width="40%">
					<table cellspacing="2" cellpadding="2" border="0" width="100%">
						<tr>
							<td width="150px" class="labelText">Name:</td>
							<td><input name='name' value="${ employee.name }"></td>
						</tr>
						<tr>
							<td width="150px" class="labelText">Grender:</td>

							<td><select name='grender'>
									<option value='Man' selected>Man</option>
									<option value='Woman'>Woman</option>
							</select></td>
						</tr>
						<tr>
							<td width="150px" class="labelText">title:</td>
							<td><input name='title' value="${ employee.title }">
							</td>
						</tr>
						<tr>
							<td width="150px" class="labelText">tel:</td>
							<td><input name='tel' value="${ employee.tel }"></td>
						</tr>
						<tr>
							<td width="150px" class="labelText">address:</td>
							<td><textarea rows="5" cols="30" style="resize: none;"
								name='address' class='check' id='address'>${ employee.address }</textarea>
							</td>
						</tr>
						<tr>
						<td width="80px" class="labelText">induction:</td>
						<td><input name='induction'
							value="<fmt:formatDate
											value='${ employee.induction }'
											pattern="MM/dd/yyyy" />"
							style="width: 120px;" class="example">
							<p id="inductionMessage" style="color: red"></p</td>

					</tr>
					<tr>
						<td width="80px" class="labelText">departure:</td>
						<td><input name='departure'
							value="<fmt:formatDate
											value='${ employee.departure }'
											pattern="MM/dd/yyyy" />"
							style="width: 120px;" class="example">
							<p id="departureMessage" style="color: red; text-align: center;"></p</td>

					</tr>
					<tr>
						<td><input type="hidden" value="${employee.attachmentId }"
							name="attachmentId" id="attachmentId"></td>
					</tr>
					</table> </form:form>
				</td>
				<td><img alt="头像" src="<c:url value ="/" />"
				width="250px" height="250px" id="img"> <br> <br> <form:form
					method="post" enctype="multipart/form-data" id="savefile">
					<input type="file" name="file" id="file"
						style="background: white; width: 250px">
					<input name="moduleName" id="moduleName" value="employeeInfo"
						type="hidden">
					<input type="submit" value="上传" id="upload">
				</form:form></td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<table>
						<tr>
							<td valign="top" class="buttonRow"><input type="submit"
								value=" Submit " class="button" onclick="doSubmit()" /></td>
							<td valign="top" class="buttonRow"><input type="button"
								value=" Back " class="button" name="blGo2242"
								onclick="toBack();" /></td>
						</tr>
					</table>
				</td>
			</tr>
		</table>

		<script type="text/javascript">
			function doSubmit() {
				addForm.action = "<c:url value='/employeeinfo/add'/>";
				addForm.submit();
			}
			function toBack() {
				self.location = "<c:url value='/employeeinfo/page'/>"
			}
			$("#upload").click(
					function() {
						$('#savefile').attr('action',
								'<c:url value ="/attachment/upload" />')

						$('#savefile').ajaxSubmit(
								{
									dataType : 'json',
									success : function(msg) {
										
										var id = msg.id;
									
										$("#attachmentId").attr("value", id);
										  $("#img").attr("src","<c:url value='/' />"+"attachment/"+id+"/downLoad");
									}
								});

						$("#file").val("");//清空文件域
						return false; //防止刷新？
					})
		</script>
</body>
</html>